(function(vue){
    Vue.component("ice",{
        template:`
            <h1>(╹ڡ╹ )</h1>
        `
    });
    Vue.component("sodo",{
        template:`
            <h1>φ(゜▽゜*)♪</h1>
        `
    });
    Vue.component("eat",{
        template:`
            <h1>~~>_<~~</h1>
        `
    });

    let routes = [
        {
            path:'/ice',
            component:'ice'
        },
        {
            path:'/sodo',
            component:'sodo'
        },
        {
            path:'/eat',
            component:'eat'
        },
    ];

    //添加监听事件
    window.addEventListener('hashchange',function(e){
        console.log(window.location.hash);
        let path = window.location.hash.split('#')[1];
        //
        let route_item = routes.find(v=>{
            if(v.path === path){
                return true;
            }
        })
        console.log(route_item);
        console.log(vm.componentId);
        vm.componentId = route_item.component;
    });
})(Vue);